<template> 
    <div class="app-container">
        <div class="ces-main">
    
     <!-- <el-form
            :inline="true"
            :model="Search"
            class="demo-form-inline"
            size="mini"
          >
           <el-col :xs="10" :sm="8" :lg="6" :xl="4">
            <el-tabs v-model="Search.Status" @tab-click="refresh">
              <el-tab-pane
                v-for="item in cities"
                :label="item.label"
                :name="item.value"
                :key="item.value"
              ></el-tab-pane>
            </el-tabs>
           </el-col>
            <el-col :xs="10" :sm="8" :lg="6" :xl="4">
             <el-tabs v-model="Search.BillState" @tab-click="refresh">
              <el-tab-pane
                v-for="item in BillStatecities"
                :label="item.label"
                :name="item.value"
                :key="item.value"
              ></el-tab-pane>
            </el-tabs>
              </el-col>
          </el-form> -->
            <v-GetToolBar align="right" :key="MenuCode" :MenuCode='MenuCode'  
            :IsfunEdit='IsfunEdit'
            :Isfunfail='Isfunfail'
            @handeAdd='handeAdd'
            @handleEdit='handleEdit'
            @OpenFindForm='OpenFindForm'
            @handlexportData='handlexportData'
            @IsfunEdit='handleIsfunEdit'
            @IsfunDelete='handleIsfunfail'
              @handleclose='handleclose'
            ></v-GetToolBar>
         
      
    
            <ces-table 
            size='mini'
            :isSelection='false'
            :isIndex='true'
            :isSearch='true'
            :isHandle='false'
            :IsfunEdit='IsfunEdit'
            :Isfunfail='Isfunfail'
            :tableData='tableData' 
            :tableCols='tableCols' 
            :Search='Search'
            @refresh="refresh"
            @handleEdit='handleEdit'
            @handleDelete="delData"
            @handrowclick="handrowclick"
            >
            </ces-table>
            </div>
    
     <!--搜索弹框-->
        <el-dialog
          title="搜索"
          :visible.sync="SearchDialog"
          custom-class="dialogClass"
          class="searchDialog"
          center
          ref="searchDialog"
          :modal="false"
          :close-on-click-modal="true"
        >
          <el-form :model="Search" label-width="90px" ref="searchForm">
           
           <Search-Form 
           :frame="true"
            ref="form"
            size='mini'
            labelWidth = '50px' 
            :searchData = 'Search'
             :tableCols = 'tableCols'
            :searchHandle="searchHandle"
            @handleEnter="refresh"></Search-Form >
          </el-form>
          <div
            slot="footer"
            :style="{ 'margin-buttom': 0 == 0 ? DialogBtnMargin : DialogBtnMargin }"
          >
            <el-button @click="reform()">重置</el-button>
            <el-button type="primary" @click="refresh()">确 定</el-button>
          </div>
        </el-dialog>
    
    
    </div>
    </template>
    
    <script>
    
    
    //引入组件
    
    import cesTable from "../Common//table.vue";
    import SearchForm from "../Common//Search.vue";
    import MianForm from "../Common//form.vue";
    
    import { funDownload,funDownloadv1,GetTableColsData} from "@/api/Common";
    import { getDataList,DeleteForm,CloseForm,getfunDownload } from '@/api/MesPieceWork/CompleteProcedureRoport'; //更改
    import vGetToolBar from "../Common/GetToolBar";
    
    export default {
      name:"CompleteProcedureMonthRoport",
        data(){
             //表单查询一般分为input，下拉框，和日期，下面是下拉框时的设置下拉信息的情况，我的项目没有用到，但是留着方便看
          
            return {
            MenuCode: "",
            tableData:[],//表格数据
            tableCols:[],//表格列数据
            searchHandle:[],
            billID:"",
            IsfunEdit:false,
            Isfunfail:false,
            Search: {
            // 查询条件
            total: 0, // 总记录数
            pageSize: 50, // 一页显示的记录数
            page: 1, // /当前页码
            RNO: "006", // 表编号  根据Controller中对应的表编号 //更改
            InterID:"1578",
            jsWhere: "", // 自定义条件
            Download:""
            // Status: 0,
            //   BillState: "BillStateALL",
           
          },
           cities: [
              {
              value: "ALL",
              label: "ALL",
            },
            {
              value: "0",
              label: "草稿",
            },
            {
              value: "1",
              label: "审核中",
            },
            {
              value: "2",
              label: "结案",
            },
            {
              value: "3",
              label: "作废",
            },
          ],  BillStatecities: [
              {
              value: "BillStateALL",
              label: "ALL",
            },
            {
              value: "0",
              label: "未完成",
            },
            {
              value: "2",
              label: "已完成",
            }],
           SearchDialog: false,
             DialogBtnMargin: 0,
             dialogVisible: false,
              
            }
        },
    
       components:{ //引入组件后注册组件
        cesTable, 
         vGetToolBar,
         SearchForm,
         MianForm
       },
       mounted(){
        debugger
       
       

        this.InterID = this.$route.query.InterID.replace("Page","");
        var InterData=this.InterID.split('-');
        this.InterID=InterData[1];
        this.MenuCode=InterData[0];
        this.Search.InterID=this.InterID;
          this.Search.RNO=this.InterID;
          //this.MenuCode=this.$route.query.MenuCode;
        //this.getTableCols()
        this.getDataList()
       },
        methods:{
             //搜索重置
        refresh() {
          this.getDataList();
        },
         reform() {
           this.Search = {
            // 查询条件
            // total: 0, // 总记录数
            pageSize: 50, // 一页显示的记录数
            page: 1, // /当前页码
            RNO: "006", // 表编号  根据Controller中对应的表编号 //更改
            InterID:"1578",
            jsWhere: "", // 自定义条件
            Download:"",
            //   Status: 0,
            //   BillState: "BillStateALL",
          };
          this.Search.InterID=this.InterID;
          this.Search.RNO=this.InterID;
           this.getDataList();
        },
          //读取列配置
            async getTableCols(){
            this.tableCols = []
            const res = await  GetTableColsData({InterID:this.InterID});//更改
            this.tableCols=res.data;
                      
             },
            async getDataList() {
            const res = await getDataList({ data: JSON.stringify(this.Search) });
            this.tableData = res.data.Table;
            this.tableCols=res.data1;
            //将data 中的数据放到DataList中
            this.Search.total = res.data.Table1[0].RecordCount;
        
        },OpenFindForm() {
          //打开搜索框
          this.SearchDialog = true;
          //计算外边距
          console.log(this.$refs.searchDialog.offsetHeight);
          this.DialogBtnMargin = this.$refs.searchDialog.offsetHeight - 40;
        },async handlexportData() {
          this.Search.Download="1";
          const res = await getfunDownload({ data: JSON.stringify(this.Search) });
          this.Search.Download="0";
          funDownloadv1(res); //更改
        }, handleIsfunEdit() {
          this.IsfunEdit=true;
        }, handleIsfunfail() {
           this.Isfunfail=true;
        },async handeAdd() {
          // 新建
    
          let routeUrl = this.$router.push({
            path: "/MesPieceWork/CompleteProcedureRoportForm",//更改
            query: { billID: "", IsPostBack: false },
          });
          window.open(routeUrl.path, "_top");
        
        },
       async handleEdit(scope) {
          // 修改
    
           let routeUrl = this.$router.push({
            path: "/MesPieceWork/CompleteProcedureRoportForm",//更改
            query: { billID: scope.row.billID, IsPostBack: false },
          });
          window.open(routeUrl.href, "_top");
    
          this.inputName = row.billID;
       
          
        },delData({ $index, row }) {
         this.$confirm('删除操作, 是否继续?', '提示', {
            confirmButtonText: "确认",
            cancelButtonText: "取消",
          })
            .then(async () => {
             
               
    
                const result = await DeleteForm({
    
                  billID: row.billID,
                  types: 1,
                  IsPostBack: false,
                });
    this.getDataList();
                this.$message({
                  type: "success",
                  message: result.msg,
                });
              
            })
            .catch((err) => {
              console.error(err);
            });
        }, handrowclick(row)
        {
    
           
             this.billID=row.billID;
    
        },handleclose() {
    
    
        if(this.billID!="")
        {
    
     this.$confirm('关单操作, 是否继续? 订单号：'+this.billID, '提示', {
            confirmButtonText: "确认",
            cancelButtonText: "取消",
          })
            .then(async () => {
             
               
    
                const result = await CloseForm({
    
                  billID: this.billID,
                  types: 1,
                  IsPostBack: false,
                });
    this.getDataList();
                this.$message({
                  type: "success",
                  message: result.msg,
                });
              
            })
            .catch((err) => {
              console.error(err);
            });
        }else
        {
           this.$notify({
                title: "关单操作，请选择数据"+this.billID,
                dangerouslyUseHTMLString: true,
                message: "",
                type: "error",
              });
        }
    
    
        
        },
         
           
      }
    }
    </script>
    
    <style lang="scss" scoped>
    
    .app-container {
      .EditObjs-table {
        margin-top: 30px;
      }
    
      .permission-tree {
        margin-bottom: 5px;
      }
    }
    .searchDialog ::v-deep .el-dialog__header {
      background: #409eff;
    }
    .searchDialog ::v-deep .el-dialog__title {
      color: #fff;
    }
    .searchDialog ::v-deep .el-dialog__headerbtn .el-dialog__close {
      color: #fff;
    }
    </style>